<template>
    <div>
        <v-dialog
            title="经营调整"
            :show.sync="dialogVisible"
            @beforeClose="beforeClose"
            width="1000px">
            <div class="card-box">
                <el-form ref="businessDetails" label-position="top" :model="business" class="form-wrap" size="small" :rules="rules">
                    <el-row :gutter="20">
                       <el-col :span="8">
                           <el-form-item label="经营情况" prop="businessOperationAfter">
                               <el-select v-model="business.businessOperationAfter" placeholder="请选择">
                                   <el-option
                                       v-for="item in operations"
                                       :key="item.value"
                                       :label="item.label"
                                       :value="item.value"
                                       :disabled="item.value === userOperation">
                                   </el-option>
                               </el-select>
                           </el-form-item>
                       </el-col>
                       <el-col :span="16">
                           <el-form-item label="备注" prop="remarks">
                               <el-input v-model="business.remarks" maxlength="100"></el-input>
                           </el-form-item>
                       </el-col>
                    </el-row>
                    <el-row :gutter="20">
                        <el-col :span="8">
                            <el-form-item label="调整人" prop="adjustUserName">
                                <el-input v-model="business.adjustUserName" maxlength="25" readonly></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="8">
                            <el-form-item label="调整日期" prop="adjustDate">
                                <el-date-picker
                                    v-model="business.adjustDate"
                                    type="date"
                                    value-format="yyyy-MM-dd HH:mm:ss"
                                    format="yyyy-MM-dd HH:mm:ss"
                                    placeholder="选择日期">
                                </el-date-picker>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </el-form>
            </div>
            <span slot="foot">
            <el-button @click="handleCancel" class="receiver">取 消</el-button>
            <el-button @click="handleCommit">提 交</el-button>
          </span>
        </v-dialog>
    </div>
</template>

<script>
import { getDict } from '~/utils'
import dbl from '~/utils/dbl'
export default {
    name: "business-adjustment",
    data() {
        return {
            user: dbl.get('user'),
            dialogVisible: false,
            userOperation: '',
            business: {
                roomId: '',
                businessOperationBefore: '',
                businessOperationAfter: '',
                remarks: '',
                adjustUserName: '',
                adjustDate: '',
                propertyName: '',
                projectName: '',
                adjustUserId: ''
            },
            operations: [],
            rules: {
                businessOperationAfter: [{required: true, message: '请选择经营情况', trigger: 'blur'}],
                remarks: [{required: true, message: '请输入备注', trigger: 'blur'}],
                adjustUserName: [{required: true, message: '请输入调整人', trigger: 'blur'}],
                adjustDate: [{required: true, message: '请输入调整日期', trigger: 'blur'}]
            }
        }
    },
    methods: {
        beforeClose(done) {
            done()
            this.handleCancel()
        },
        handleCancel() {
            this.dialogVisible = false
            this.business.businessOperationAfter = ''
            this.business.remarks = ''
            this.business.adjustDate = ''
        },
        handleCommit() {
            this.$refs.businessDetails.validate((valid) => {
                if (valid) {
                    this.$emit('businessDetails',this.business)
                }
            })
        },
        show(data) {
            this.dialogVisible = true
            this.business.roomId = data[0].roomId
            this.userOperation = data[0].operation
            this.business.businessOperationBefore = data[0].operation
            this.business.propertyName = data[0].propertyName
            this.business.projectName = data[0].projectName
        }
    },
    mounted() {
        this.operations = getDict('property_operations')
        this.business.adjustUserName = this.user.realName
        this.business.adjustUserId = this.user.userId
    }
}
</script>

